	/**
	 * box组件 
	 * 
	 * @param config{
	 * 			  title      : '',
	 *            html       : '要显示的html', 
	 *            btn        : false不显示下面的but
	 *            url        : '要加载的html页面，与html不能同时存在',
	 *            width      : ''
	 *            height     : ''，
	 *            buttonName     : ['','']
	 *            templateRender : {}要渲染的模板数据对象
	 *       }
	 *       
	 * @author fb
	 */
	window.mofang.ui.webBox = function(params){
		var confs = {
				title         :  '系统提示',
				html          :  '',
				btn           :  true,
				width         :  600,
				height        :  'auto',
				buttonName    :  ['取消','保存'],
				closeFun      :  function(){},
				saveFun       :  function(){}
				
		
		};
		
		var conf = $.extend(confs, params);
		var $box = null;
		var version = null;

		var init = function(){
			version = "version".concat(new Date().getTime());
			var footerbtn = '';
			
			if (conf.btn) {
				footerbtn = '<button type="button" class="btn btn-default" data-dismiss="modal">'+ conf.buttonName[0] + '</button>'+
                			'<button type="button" class="btn btn-success" id="'+ getId('save') +'">'+ conf.buttonName[1] + '</button>';

			}
			
			var heightStyle = conf.height == 'auto' ? '' : 'style="height:'+conf.height+'px;"';
			
			$box = $('<div class="modal fade" >'+
				    '<div class="modal-dialog" style="width:'+ conf.width +'px;height:'+conf.height+'px;">'+
				        '<div class="modal-content">'+
				            '<div class="modal-header">'+
				                '<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>'+
				                '<h4 class="modal-title">'+ conf.title +'</h4>'+
				            '</div>'+
				            '<div class="modal-body" id="'+ getId('body') +'" '+ heightStyle +'>'+
				            
				            '</div>'+
				            '<div class="modal-footer" id="'+ getId('footer') +'">'+ 
				            footerbtn +
				            '</div>'+
				        '</div>'+
				   ' </div>'+
			 '</div>');
			
			return  this;
		};
		
		
		var show = function(callBack){
			if (conf.url) {
				util.load(conf.url,function(html) {
					html = conf.templateRender ? template.compile(html)(conf.templateRender) : html;
					$box.find('#' + getId('body')).html(html);
				});
			} else {
				conf.html = conf.templateRender ? template.compile(conf.html)(conf.templateRender) : conf.html;
				$box.find('#' + getId('body')).html(conf.html);
			}
			
			$box.modal({
				keyboard : false
			}).on({
				'hidden.bs.modal' : function() {
					conf.closeFun();
					$(this).remove();
				}
			});
			
			if (conf.btn) {
				$box.find('#' + getId('save')).unbind('click').bind('click', function(e) {
					//$box.trigger('complete');
					conf.saveFun(function(){
						$box.modal('hide');
					});
				});
			}
			
			setTimeout(callBack, 350);
		};
		

		
		var getId = function(srcId){
			return version.concat(srcId);
		};

		return {
			init   : init,
			show   :  show
		};
	};
